<div data-id="monitor_certificate">
  <form class="bs-example form-horizontal xs-form form-plr5">
    <div class="form-group">
      <label class="col-lg-2 control-label">用户名</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorUserName" />
      </div>
      <label class="col-lg-2 control-label">密码</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPassWord" />
      </div>
    </div>
    <div class="form-group">
      <label class="col-lg-2 control-label">密码</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPassWord" />
      </div>
      <label class="col-lg-2 control-label">命令行提示符</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="commandPrompt" />
      </div>
    </div>
    <div class="form-group">
      <label class="col-lg-2 control-label">登录提示符</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="loginPrompt" />
      </div>
      <label class="col-lg-2 control-label">密码提示符</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="passwordPrompt" />
      </div>
    </div>
    <div class="form-group">
      <label class="col-lg-2 control-label">端口号</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
      <label class="col-lg-2 control-label">SNMP模板</label>
      <div class="col-lg-3" data-id="snmp">
        <select class="form-control input-sm" data-type="select" data-id="snmpName">
        <option value="1">public</option>
        </select>
      </div>
    </div>
    <div class="form-group">
      <label class="col-lg-2 control-label">版本</label>
      <div class="col-lg-3" data-id="snmp">
        <select class="form-control input-sm" data-type="select" data-id="snmpVersion">
            <option value="1">SNMP V1</option>
            <option value="2">SNMP V2c</option>
            <option value="3">SNMP V3</option>
        </select> 
      </div>
    </div>
    <div class="form-group" data-id="show_for_snmp_v1">
      <label class="col-lg-2 control-label">读COMMUNITY</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
      <label class="col-lg-2 control-label">写COMMUNITY</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
    </div>
    <div class="form-group" data-id="show_for_snmp_v3" style="display: none;">
      <label class="col-lg-2 control-label">Context ID</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
      <label class="col-lg-2 control-label">Context Name</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
    </div>
    <div class="form-group" data-id="show_for_snmp_v3" style="display: none;">
      <label class="col-lg-2 control-label">用户名</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
      <label class="col-lg-2 control-label">安全级别</label>
      <div class="col-lg-3" data-id="snmp">
        <select class="form-control input-sm" data-type="select">
        	<option value="option 1">NOAUTH_NOPRIV</option>
        	<option value="option 2">AUTH_NOPRIV</option>
        	<option value="option 3">AUTH_PRIV</option>
        </select>
      </div>
    </div>
    <div class="form-group" data-id="show_for_snmp_v3" style="display: none;">
      <label class="col-lg-2 control-label">认证方式</label>
      <div class="col-lg-3" data-id="snmp">
        <select class="form-control input-sm" data-type="select">
        	<option value="option 1">SHA</option>
        	<option value="option 2">MD5</option>
        </select>
      </div>
      <label class="col-lg-2 control-label">SID</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
    </div>
    <div class="form-group" data-id="show_for_snmp_v3" style="display: none;">
      <label class="col-lg-2 control-label">加密方式</label>
      <div class="col-lg-3" data-id="snmp">
        <select class="form-control input-sm" data-type="select">
        	<option value="option 1">3DES</option>
        	<option value="option 2">AES128</option>
        	<option value="option 3">AES192</option>
        	<option value="option 4">AES256</option>
        	<option value="option 5">DES</option>
        </select>
      </div>
      <label class="col-lg-2 control-label">加密口令</label>
      <div class="col-lg-3" data-id="snmp">
        <input type="text" class="form-control input-sm" data-id="monitorPort" validate="number"/>
      </div>
    </div>
    <div class="form-group">
      <div class="col-lg-10">
          <div class="table-oper">
              <a href="javascript:void(0);" data-type="test_btn">
                <span>测试</span>
              </a>
          </div>
      </div>
    </div>
  </form>
</div>

<script>
$(document).ready(function(){
$("[data-id=snmpVersion]").change(function (){
  var id = $(this).val();
  if (id == "1" || id == "2")
  {
    $("[data-id=show_for_snmp_v1]").show();
    $("[data-id=show_for_snmp_v3]").hide();
  }
  else
  {
    $("[data-id=show_for_snmp_v1]").hide();
    $("[data-id=show_for_snmp_v3]").show();
  }
});
});
</script>